const path = require("path");
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const basePath = __dirname;  // 当前项目的物理路径
// console.log(path.join(basePath),'......');

module.exports = {
    // 上下文
    context: path.join(basePath, "src"),
    // 解析
    resolve: {
        // extensions 检测以.js为后缀的文件，处理文件
        extensions: [".js", ".jsx"]
    },
    // 入口
    entry: {
        app: ['./index.jsx'],  // app 取别名
        vender: [
            'react',
            'react-dom'
        ]
    },
    // 出口，打包文件到dist目录下
    output: {
        path: path.join(basePath, "dist"),
        filename: "[name].[chunkhash].js"
    },
    // 模块，找到规则
    module: {
        // 给resolve里的后缀添加规则
        rules: [
            {
                // 正则 \. 表示转义，括号里面表示两者都行
                test: /\.(js|jsx)$/,
                // 需要使用哪种loader
                loader: "babel-loader",
                // 排除node_modules 不打包
                exclude: /node_modules/,
            }
        ]
    },
    // 插件
    plugins: [
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin({
            filename: "index.html",
            template: "index.html"
        })
    ]
}
